<template>
	<view class="list">
        <view class="item" v-for="(item, i) in patientsList" :key="i" @tap="visitorSelect(item)" v-if="patientsList.length > 0">
            <view class="icon">
                <u-image width="180rpx" height="180rpx" :src="getServerStatic('/static/images/a21.png')"></u-image>
            </view>
            <view class="">
                <view class="user-info">
                    <view class="name">{{ item.name }}</view>
                    <view class="age">
                        <span v-if="item.sex === 1">男</span>
                        <span v-else>女</span>
                        {{ item.age }}
                    </view>
                    <view class="self" v-if="item.is_myself == 1">本人</view>
                </view>
                <view class="mobile">
                    {{ item.mobile }}
                </view>
            </view>
            <u-image width="36rpx" height="30rpx" :src="getServerStatic('/static/images/a22.png')"></u-image>
        </view>

        <u-empty
          v-else
          mode="data"
          icon="https://cdn.uviewui.com/uview/empty/data.png"
        >
        </u-empty>
	</view>

	<view class="btn">
		<u-button throttleTime="1000" :customStyle="{height: '86rpx', boxShadow: '0rpx 4rpx 34rpx 1rpx rgba(87,129,240,0.4)', letterSpacing: '.1rem'}" :hairline="false" type="mini" shape="circle" color="linear-gradient(315deg, #4975EC 0%, #97B3FF 100%)" @click="goAdd">添加就诊人</u-button>
	</view>
</template>

<script setup>
    import {ref, reactive, readonly} from 'vue'
    import {onLoad, onShow, onUnload} from '@dcloudio/uni-app'
    import {getPatients} from "@/api/user";
    import {getToken} from "@/utils/cache";
    import {getServerStatic} from "@/utils/tool";

	const status = ref('')
    // 参数
    const scheduleId = ref(0)

	onLoad((evt) => {
        if (evt?.schedule_id) {
            scheduleId.value = evt?.schedule_id ?? 0
        }
        if (!getToken()) {
            uni.showToast({
                mask: true,
                title: '请先登录!',
                icon: 'error'
            })

            const pages = getCurrentPages()
            let fromPath = "/" + pages[pages.length - 1].route + `?schedule_id=${scheduleId.value}`

            setTimeout(() => {
                // @ts-ignore
                uni.redirectTo({
                    url: "/pages/login/login?fromPath=" + encodeURIComponent(fromPath)
                });
            },800)

        } else {
            console.log('携带参数',evt)
            status.value = evt?.status
            scheduleId.value = evt?.schedule_id ?? 0

            handleGetPatients()
        }
	})


    onShow( () => {

    })

    onUnload(() => {

    })

	const goAdd = () => {
        // 订单选择页面
        if (status.value == 'choose') {
            uni.redirectTo({
                url: `/mine/visitor/add?status=choose&schedule_id=${scheduleId.value}`
            })
        } else {
            uni.navigateTo({
                url: `/mine/visitor/add`
            })
        }
	}

    // 选择就诊人
    const visitorSelect = (item) => {
        console.log('status',status.value)
        // 选择
        if (status.value == 'choose') {

            let pages = getCurrentPages(); // 当前页面
            let beforePage = pages[pages.length - 2]; // 上一页
            uni.navigateBack({
                success: function() {
                    beforePage.onShow(
                      {
                          patient_id: item.id,
                          patient_name: item.name,
                          schedule_id: scheduleId.value,
                      }
                    ); // 执行上一页的onLoad里面的方法方法
                }
            });

        } else {
            // 编辑
            uni.navigateTo({
                url: `/mine/visitor/add?patient_id=${item.id}`
            })
        }
    }

    // 列表
    const patientsList = ref([])

    const handleGetPatients = async () => {
        const {code, data, message} = await getPatients({})
        if (code === 1) {
            patientsList.value = data
        }
    }
</script>

<style lang="scss" scoped>
	.list {
		padding: 50rpx 26rpx 180rpx;
		.item {
			@include between(100%);
			position: relative;
			margin-bottom: 30rpx;
			padding: 34rpx 38rpx;
			background: #FFFFFF;
			border-radius: 30rpx;
            box-shadow: 0 0 20rpx 1rpx rgba(187,187,187,.16);

			.icon {
				position: absolute;
				top: 0;
				right: 38rpx;
				z-index: 99;
			}

			.user-info {
				@include start();
				align-items: flex-end;
				.name {
					font-size: 32rpx;
					color: #312C2A;
				}
				.age {
					font-size: 26rpx;
					color: #606672;
					margin-left: 26rpx;
				}
				.self {
					@include center(86rpx, 38rpx);
					margin-left: 30rpx;
					background: linear-gradient(315deg, #4975EC 0%, #97B3FF 100%);
					border-radius: 7rpx;
					font-size: 26rpx;
					color: #fff;
				}
			}
			.mobile {
				margin-top: 38rpx;
				font-size: 26rpx;
				color: #606672;
			}
		}
	}
	.btn {
		padding: 0 55rpx;
		width: 100%;
		position: fixed;
		left: 50%;
		bottom: 70rpx;
		transform: translateX(-50%);
		z-index: 999;
	}
</style>
